<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <title>{{ config('site.title') }}</title>

        <link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css">
        @yield('styles')

        <!--[if lt IE 9]>
            <script src="//cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
            <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
        <![endif]-->
    </head>
    <body>

        <div class="container">
            <ul>
            @foreach ($articles as $article)
                <li>
                    <a href="{{  url('article', $article->slug)  }}">{{ $article->title }}</a>
                    <em>({{ $article->publish_at }})</em>
                    <p>
                        {{ str_limit($article->content) }}
                    </p>
                </li>
            @endforeach
            </ul>
            <hr>
            <div style="display:none;">Page {{ $articles->currentPage() }} of {{ $articles->lastPage() }}</div>
            {!! $articles->render() !!}
        </div>

        <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
        <script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
        <!-- Include all compiled plugins (below), or include individual files as needed -->
        <script src="//cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

        @yield('scripts')

    </body>
</html>